<template>
  <BaseForm v-model="formDataModel" @close="$emit('callBack')" />
</template>

<script lang="ts" setup>
import type { FormInstance } from "element-plus";
import DrillInfoMaterialApi from "/@/api/DrillInfoMaterialApi.ts";
import { translate } from "/@/i18n";
import FORM_FIELD_TYPE from "/@/constants/FormFieldType.ts";
import DrillInfoApi from "~/src/api/webPath/DrillInfoApi";
import CompanyInfoApi from "~/src/api/CompanyInfoApi";
import { useEnumList } from "~/src/utils/useEnumList";
defineOptions({
  name: "DrillInfoMaterialEdit",
});
const props = defineProps({
  modelValue: {},
});
const emit = defineEmits(["fetch-data", "callBack"]);

const formRef = ref<FormInstance>();
const title = ref<string>("");
const dialogFormVisible = ref<boolean>(false);
const drillList = ref([])
const materialTypeList = useEnumList("MaterialType")


onMounted(async () => {
  const { data: { records: data } } = await DrillInfoMaterialApi.getDrillPageData({_size: 999, _current: 1})
  console.log(data)
  drillList.value = data.map(x => ({ label: x.drillName, value: x.id }))
  console.log(1111111111111, drillList.value);

})

const formDataModel = ref({
  columnCount: 1,
  expandLimit: 6,
  autoFit: false,
  columnWidth: "300px",
  labelPosition: "right",
  labelWidth: "100px",
  modelData: {}, //表单参数值 初始化
  callback: async (any: object) => {
    //表单执行成功后回调
    //完成数据提交
    const { message } = await DrillInfoMaterialApi.save(any);
    $baseMessage(message, "success", "vab-hey-message-success");
    dialogFormVisible.value = false;

    //事件及数据推送到上一层父类
    emit("callBack", any); //把表单数据推送到上一层
  },
  items: [
    //表单item数据初始化
    {
      label: "培训",
      field: "drillId",
      clearable: true,
      type: FORM_FIELD_TYPE.SINGLE_LAYER_SELECT,
      options: drillList,
      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "资料名称",
      field: "materialName",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "资料类型",
      field: "materialType",
      clearable: true,
      type: FORM_FIELD_TYPE.SINGLE_LAYER_SELECT,
      options: materialTypeList,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "描述",
      field: "description",
      clearable: true,
      type: FORM_FIELD_TYPE.TEXTAREA,
      props: {
        rows: 4
      },

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "资料",
      field: "materialUrl",
      clearable: true,
      type: FORM_FIELD_TYPE.UPLOAD,
      fileNameField: "materialName",
      config: {
        type: "file",
        limit: 1
      },

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    // {
    //   label: "创建人",
    //   field: "creator",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    // {
    //   label: "修改人",
    //   field: "reviser",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    // {
    //   label: "排序",
    //   field: "sort",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
  ],
});

//页面数据加载
onMounted(async () => {
  //初始化数据model
  if (props.modelValue.query) {
    //跳转过来时候有参数
    if (props.modelValue.query.drillInfoMaterialId) {
      //id存在则为编辑，加载网络数据，如上级页面带参数手动覆盖

      const { data } = await DrillInfoMaterialApi.getDetail({
        drillInfoMaterialId: props.modelValue.query.drillInfoMaterialId, //从路由中获取参数
      });
      formDataModel.value.modelData = data;
    } else {
      //新增时候则用父类页面传参默认填充可根据业务修改
      for (const key in props.modelValue.query) {
        formDataModel.value.modelData[key] = props.modelValue.query[key];
      }
    }
  }
});

//方法暴露区域  todo
defineExpose({});
</script>
